<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="../js/utils.js" type="text/javascript" charset="utf-8"></script>
		<style type="text/css">
			*{margin: 0;
			  padding: 0;
			 }
			div{
				width: 300px;
				height: 250px;
				position: absolute;
				top: 0;
				bottom: 0;
				left: 0;
				right: 0;
				margin: auto;
				border: 1px solid orangered;
				padding: 20px;
			}
			div h2{
				color: #FF4500;
			}
			div form p{
				font-size: 16px;
				margin:10px 0;
			}
			div form p input{
				outline: none;
				margin:10px;
			}
			div form .button{
				float: right;
				
			}
			div form .button button{
				width: 100px;
				height: 30px;
				color: #fff;
				background-color: cornflowerblue;
				outline: none;
				border: none;
				cursor: pointer;
				border-radius: 10px;
			}
		</style>
	</head>
	<body>
		<div>
			<h2>登&nbsp;&nbsp;录</h2>
			<form >
				<p>用户名：<input type="text" name="name" id="name"  /></p>
				<p style="margin-left: 15px;">密码：<input type="password" name="pwd" id="pwd"  /></p>
				<p>7天免登陆<input type="checkbox" id="check"  /></p>
				<p class="button"><button>登录</button></p>
			</form>
		</div>
		<script type="text/javascript">
			var form=document.querySelector("form")
			var nameInput=document.querySelector("#name")
			var pwdInput=document.querySelector("#pwd")
			var check=document.querySelector("#check")
			
			form.addEventListener('submit', function(e){
				e.preventDefault()
				const name=nameInput.value
				const pwd=pwdInput.value 
				utils.post('../api/user/login.php',{name,pwd}, resp=>{
					if(resp.code===200){
						if(check.checked){
							utils.setCookie('name',name,{expires:7,path:'/'})
						}else{
							utils.setCookie('name',name,{path:'/'})
						}
						alert(resp.body.msg+',即将回到首页')
						location.replace('../index.html')
					}else{
						alert(resp.body.msg)
					}
				})
				})
		</script>
	</body>
</html>
